page,
view,
scroll-view,
text,
image,
textarea,
button,
swiper,
swiper-item,
input {
  box-sizing: border-box;
}

view[hidden] {
  display: none !important;
}

page {
  background-color: $uni-bg-color-grey;
  height: 100%;
  font-size: 30rpx;
  color: $uni-text-color;
}

.container {
  width: 100%;
  height: 100%;
}


.border-box {
  box-sizing: border-box;
}

.rounded-circle {
  border-radius: 50% !important;
}

.rounded-pill {
  border-radius: 50rem !important;
}

.border-radius-base {
  border-radius: 6rpx;
}

.border-radius-lg {
  border-radius: 12rpx;
}

.border-b {
  border-bottom: 1px #EDEDED solid;
}

.border-t {
  border-top: 1px #EDEDED solid;
}

.border-l {
  border-left: 1px #EDEDED solid;
}

.border-r {
  border-right: 1px #EDEDED solid;
}

.pre-line {
  white-space: pre-line;
}

.align-top {
  vertical-align: top !important;
}

.align-middle {
  vertical-align: middle !important;
}

.align-bottom {
  vertical-align: bottom !important;
}

.align-text-bottom {
  vertical-align: text-bottom !important;
}

.align-text-top {
  vertical-align: text-top !important;
}

/* 弹性布局 */
.flex {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
}

.flex-column {
  flex-direction: column;
}

.flex--reverse {
  -webkit-box-orient: horizontal;
  -moz-box-orient: horizontal;
  -webkit-box-direction: reverse;
  -moz-box-direction: reverse;
  -webkit-flex-direction: row-reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
}

.flex--row {
  -webkit-box-orient: vertical;
  -moz-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

/* .flex--row.flex--reverse */
/* .flex--reverse {
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    -webkit-box-direction: reverse;
    -moz-box-direction: reverse;
    -webkit-flex-direction: column-reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
} */

/* .flex--row.flex--wrap */
.flex--wrap {
  /* 09版 */
  /*-webkit-box-lines: multiple;*/
  /* 12版 */
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  -o-flex-wrap: wrap;
  flex-wrap: wrap;
}

.justify-between {
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}

.justify-evenly {
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-evenly;
  justify-content: space-evenly;
}

.justify-around {
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: distribute;
  -webkit-justify-content: space-around;
  justify-content: space-around;
}

.justify-center {
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
}

.justify-start {
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  -webkit-justify-content: flex-start;
  justify-content: flex-start;
}

.justify-end {
  -webkit-box-pack: end;
  -moz-box-pack: end;
  -ms-flex-pack: end;
  -webkit-justify-content: flex-end;
  justify-content: flex-end;
}

.align-start {
  -webkit-box-align: start;
  -moz-box-align: start;
  -ms-flex-align: start;
  -webkit-align-items: flex-start;
  align-items: flex-start;
}

.align-end {
  -webkit-box-align: end;
  -moz-box-align: end;
  -ms-flex-align: end;
  -webkit-align-items: flex-end;
  align-items: flex-end;
}

.align-center {
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}

.align-baseline {
  -webkit-box-align: baseline;
  -moz-box-align: baseline;
  -ms-flex-align: baseline;
  -webkit-align-items: baseline;
  align-items: baseline;
}

.align-stretch {
  align-items: stretch;
}

.flex--flex-grow-all {
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -webkit-flex-grow: 1;
  -ms-flex-grow: 1;
  flex-grow: 1
}

.flex--flex-grow-last :last-child {
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -webkit-flex-grow: 1;
  -ms-flex-grow: 1;
  flex-grow: 1
}

.flex--flex-grow-middle :nth-child(2) {
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -webkit-flex-grow: 1;
  -ms-flex-grow: 1;
  flex-grow: 1
}

.flex-center-wrapper {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;

  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;

  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}

.flex--justify-content--center--align-items--center {
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;

  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}

.flex--justify-content--space-between--align-items--center {
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;

  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}

.shrink0 {
  flex-shrink: 0;
}

$length: 1000;

@mixin create-ctx-style($len) {
  .mt-#{$len} {
    margin-top: 1upx * $len !important;
  }

  .ml-#{$len} {
    margin-left: 1upx * $len !important;
  }

  .mr-#{$len} {
    margin-right: 1upx * $len !important;
  }

  .mb-#{$len} {
    margin-bottom: 1upx * $len !important;
  }

  .mlr-#{$len} {
    margin: 0 1upx * $len !important;
  }

  .mtb-#{$len} {
    margin: 1upx * $len 0 !important;
  }

  .pd-#{$len} {
    padding: 1upx * $len !important;
  }

  .pt-#{$len} {
    padding-top: 1upx * $len !important;
  }

  .pl-#{$len} {
    padding-left: 1upx * $len !important;
  }

  .pr-#{$len} {
    padding-right: 1upx * $len !important;
  }

  .pb-#{$len} {
    padding-bottom: 1upx * $len !important;
  }

  .plr-#{$len} {
    box-sizing: border-box;
    padding-left: 1upx * $len !important;
    padding-right: 1upx * $len !important;
  }

  .ptb-#{$len} {
    box-sizing: border-box;
    padding-top: 1upx * $len !important;
    padding-bottom: 1upx * $len !important;
  }

  .padding-#{$len} {
    box-sizing: border-box;
    padding: 1upx * $len !important;
  }

  .fsize-#{$len} {
    font-size: 1upx * $len !important;
  }
}

@while $length>=0 {
  @include create-ctx-style($length);
  $length: $length - 2;
}

/*1-1000*/
$local: 1000;

@while $local >=0 {
  .h-#{$local} {
    height: 1% * $local !important;
  }

  /*高度upx*/
  .height-#{$local} {
    height: 1upx * $local !important;
  }

  /* 行高 */
  .lh-#{$local} {
    line-height: 1upx * $local !important;
  }

  /*宽度度百分比*/
  .w-#{$local} {
    width: 1% * $local !important;
  }

  .border-radius-#{$local} {
    border-radius: 1upx * $local !important;
  }

  .border-radius-tl-#{$local} {
    border-top-left-radius: 1upx * $local !important;
  }

  .border-radius-tr-#{$local} {
    border-top-right-radius: 1upx * $local !important;
  }

  .border-radius-bl-#{$local} {
    border-bottom-left-radius: 1upx * $local !important;
  }

  .border-radius-br-#{$local} {
    border-bottom-right-radius: 1upx * $local !important;
  }

  /*宽度upx*/
  .width-#{$local} {
    width: 1upx * $local !important;
  }

  .fweigh-#{$local} {
    font-weight: 1*$local;
  }

  $local: $local - 1
}

$line: 10;

@while $line >=0 {
  .text-ellipsis-#{$local} {
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1 * $line;
    display: -webkit-box;
    -webkit-box-orient: vertical;
  }

  $line: $line - 1
}

.text-ellipsis {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
}

/*背景颜色*/
.bg-red {
  background-color: #e54d42;
  color: #ffffff;
}

.bg-orange {
  background-color: #f37b1d;
  color: #ffffff;
}

.bg-yellow {
  background-color: #fbbd08;
  color: #333333;
}

.bg-yellow-w {
  background-color: #fcde88;
  color: #333333;
}

.bg-olive {
  background-color: #8dc63f;
  color: #ffffff;
}

.bg-green {
  background-color: #39b54a;
  color: #ffffff;
}

.bg-cyan {
  background-color: #1cbbb4;
  color: #ffffff;
}

.bg-blue {
  background-color: #0081ff;
  color: #ffffff;
}

.bg-purple {
  background-color: #6739b6;
  color: #ffffff;
}

.bg-mauve {
  background-color: #9c26b0;
  color: #ffffff;
}

.bg-pink {
  background-color: #e03997;
  color: #ffffff;
}

.bg-brown {
  background-color: #a5673f;
  color: #ffffff;
}

.bg-grey {
  background-color: #aaa
}

.bg-light-gary {
  background-color: #e5e5e5;
  color: #474747
}

.bg-gray {
  background-color: #f0f0f0;
  color: #333333;
}

.bg-black {
  background-color: #333333;
  color: #ffffff;
}

.bg-white {
  background-color: #ffffff;
  color: #0a0a0a;
}

.bg-white-ling {
  background-color: #f7f7f7;
}

.bg-plain {
  background-color: #f8f8f8;
}

.bg-shadeTop {
  background-image: linear-gradient(rgba(0, 0, 0, 1), rgba(0, 0, 0, 0.01));
  color: #ffffff;
}

.bg-shadeBottom {
  background-image: linear-gradient(rgba(0, 0, 0, 0.01), rgba(0, 0, 0, 1));
  color: #ffffff;
}

.backgroun-gradual-origin-yellow {
  background: linear-gradient(180deg, #f2e7cb, #e1d3b6);
}

.backgroun-gradual-green-white {
  background: linear-gradient(180deg, #04c668, hsla(0, 0%, 100%, 0));
}

.backgroun-gradual-white-tran {
  background: linear-gradient(180deg, #fff, hsla(0, 0%, 100%, .5));
}

.backgroun-gradual-light-yellow {
  background: linear-gradient(180deg, #ffde82, #fff3d9);
}

.backgroun-gradual-green {
  background: linear-gradient(225deg, #00c78a, #04c668);
}

.backgroun-gradual-purple {
  background: linear-gradient(225deg, #ffa8ec, #3e8eff);
}

.backgroun-gradual-red-pink {
  background: linear-gradient(225deg, #ff45d4, #ff7a66);
}

.backgroun-gradual-black-gray {
  background: linear-gradient(225deg, #97a0ab, #5b6778);
}

.backgroun-gradual-black-light-back {
  background: linear-gradient(180deg, #4f6084, #2a303e);
}

.backgroun-gradual-golden-origin {
  background: linear-gradient(180deg, #ffdab9, #f5f5f5);
}

.backgroun-gradual-golden-yellow {
  background: linear-gradient(180deg, #fff2d2, #f5f5f5);
}

.backgroun-gradual-azure-light-azure {
  background: linear-gradient(1turn, rgba(4, 105, 247, .2), #0469f7);
}

.backgroun-gradual-azure-little-azure {
  background: linear-gradient(270deg, #e5e9f1, #b4d3fd);
}

.backgroun-gradual-brown-little-brown {
  background: linear-gradient(90deg, #4d443f, #211919);
}

.backgroun-gradual-red-little-origin {
  background: linear-gradient(225deg, #e94566, #e86f76);
}

.backgroun-light-orange {
  background: #fbf8ed;
}

.backgroun-light-green {
  background: #f0fff8;
}

.backgroun-light-pink {
  background: #fff3f3;
}

.bg-red-light {
  color: #e54d42;
  background-color: #fadbd9;
}

.bg-orange-light {
  color: #f37b1d;
  background-color: #fde6d2;
}

.bg-yellow-light {
  color: #fbbd08;
  background-color: #fef2ced2;
}

.bg-olive-light {
  color: #8dc63f;
  background-color: #e8f4d9;
}

.bg-green-light {
  color: #39b54a;
  background-color: #d7f0dbff;
}

.bg-cyan-light {
  color: #1cbbb4;
  background-color: #d2f1f0;
}

.bg-blue-light {
  color: #0081ff;
  background-color: #cce6ff;
}

.bg-purple-light {
  color: #6739b6;
  background-color: #e1d7f0;
}

.bg-mauve-light {
  color: #9c26b0;
  background-color: #ebd4ef;
}

.bg-pink-light {
  color: #e03997;
  background-color: #f9d7ea;
}

.bg-brown-light {
  color: #a5673f;
  background-color: #ede1d9;
}

.bg-grey-light {
  color: #8799a3;
  background-color: #e7ebed !important;
}

/*字体颜色*/
.text-green {
  background-color: #19be6b;
  color: #fff;
}

.text-red,
.line-red,
.lines-red {
  color: #e54d42;
}

.text-orange,
.line-orange,
.lines-orange {
  color: #f37b1d;
}

.text-yellow,
.line-yellow,
.lines-yellow {
  color: #F3C45D;
}

.text-olive,
.line-olive,
.lines-olive {
  color: #8dc63f;
}

.text-green,
.line-green,
.lines-green {
  color: #39b54a;
}

.text-cyan,
.line-cyan,
.lines-cyan {
  color: #1cbbb4;
}

.text-blue,
.line-blue,
.lines-blue {
  color: #0081ff;
}

.text-purple,
.line-purple,
.lines-purple {
  color: #6739b6;
}

.text-mauve,
.line-mauve,
.lines-mauve {
  color: #9c26b0;
}

.text-pink,
.line-pink,
.lines-pink {
  color: #e03997;
}

.text-brown,
.line-brown,
.lines-brown {
  color: #a5673f;
}

.text-grey,
.line-grey,
.lines-grey {
  color: #8799a3;
}

.text-gray,
.line-gray,
.lines-gray {
  color: #aaaaaa;
}

.text-gray-3,
.line-gray-3,
.lines-gray-3 {
  color: #333;
}

.text-gray-6,
.line-gray-6,
.lines-gray-6 {
  color: #666;
}

.text-gray-9,
.line-gray-9,
.lines-gray-9 {
  color: #999;
}

.text-black,
.line-black,
.lines-black {
  color: #000;
}

.text-white,
.line-white,
.lines-white {
  color: $color-white;
}

.text-primary {
  color: $color-primary;
}

.text-pla {
  color: #c0c4cc
}

.d-block {
  display: block
}

.text-align-center {
  text-align: center;
}

.text-align-right {
  text-align: right;
}

.text-align-left {
  text-align: left;
}

// 空数据居中全屏
.data-empty-full {
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

// 空数据局部居中  //宽高铺满内容居中
.data-empty-wh100 ,.wh100-middle{
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

// 宽度占满
.w100 {
  width: 100%;
}

// 高度占满

.h100 {
  height: 100%;
}

// 宽高占满
.wh100,
.hw100 {
  width: 100%;
  height: 100%;
}

